<template>
  <div class="app-container">
    <Find :OriginalFilter="{ static: true }" :formList="formList" />

    <div class="flex mt10 main">
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">待汇总指令</span>
        </div>
        <Table :tableHeader="tableHeader" :tableData="tableData" selection :TableHeight="'150rem'"></Table>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">汇总号查询</span>
        </div>
        <Table :tableHeader="tableHeader2" :tableData="tableData2" selection :TableHeight="'150rem'"></Table>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">汇总材料查询</span>
        </div>
        <Table :tableHeader="tableHeader3" :tableData="tableData3" :TableHeight="'150rem'"></Table>
      </el-card>
    </div>

    <div class="flex main">
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">汇总资料查询</span>
        </div>
        <Table :tableHeader="tableHeader4" :tableData="tableData4" selection :TableHeight="'100rem'"></Table>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">贴合子资料查询</span>
        </div>
        <Table :tableHeader="tableHeader5" :tableData="tableData5" selection :TableHeight="'100rem'"></Table>
      </el-card>
      <el-card shadow="never" :body-style="{ padding: '13px' }">
        <div slot="header" class="f16 mb18">
          <span style="font-weight: 600">汇总指令材料明细</span>
        </div>
        <Table :tableHeader="tableHeader6" :tableData="tableData6" :TableHeight="'100rem'"></Table>
      </el-card>
    </div>

    <div class="btns main">
      <el-button class="bg" type="primary" size="default" @click="">保存</el-button>
      <el-button type="primary" size="default" @click="">打印</el-button>
    </div>
  </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
import JMessage from '@/utils/JMessage'
export default defineComponent({
  name: 'SummaryJobDeletion'
})
</script>
<script lang="ts" setup>
import { i18n, Jzhcn } from '@/i18n'
import { ref } from 'vue'
const formList = ref([
  {
    type: 'input',
    inputPlaceholder: '请输入指令号',
    inputValue: '',
    inputLabel: ''
  },
  {
    type: 'input',
    inputPlaceholder: '',
    inputValue: '2026244',
    inputLabel: '指令数',
    inputDisabled: true
  },
  {
    type: 'button',
    checkboxLabel: '查询待汇总指令'
  },
  {
    type: 'button',
    checkboxLabel: '查询已汇总指令'
  },
  {
    type: 'button',
    checkboxLabel: '汇总作业'
  },
  {
    type: 'button',
    checkboxLabel: '删除汇总'
  },
  {
    type: 'button',
    checkboxLabel: '导出汇总资料明细'
  },
  {
    type: 'button',
    checkboxLabel: '不汇总指令删除'
  },
  {
    type: 'button',
    checkboxLabel: '删除指令查询'
  }
])

const tableHeader = ref([
  {
    label: '厂区',
    prop: 'factory'
  },
  {
    label: '指令',
    prop: 'factory',
    sortable: true
  },
  {
    label: '型体',
    prop: 'factory',
    sortable: true
  },
  {
    label: '颜色',
    prop: 'factory',
    sortable: true
  },
  {
    label: '类型',
    prop: 'factory',
    sortable: true
  },
  {
    label: '日期',
    prop: 'factory',
    sortable: true
  },
  {
    label: '交期',
    prop: 'factory',
    sortable: true
  }
])
const tableData = ref([
  {
    factory: '123'
  }
])

const tableHeader2 = ref([
  {
    label: '汇总号',
    prop: 'factory'
  },
  {
    label: '汇总日期',
    prop: 'factory'
  }
])
const tableData2 = ref([
  {
    factory: '123'
  }
])

const tableHeader3 = ref([
  {
    label: '物料编码',
    prop: 'factory'
  },
  {
    label: '材料颜色',
    prop: 'factory'
  },
  {
    label: '材料名称',
    prop: 'factory'
  },
  {
    label: '规格',
    prop: 'factory'
  },
  {
    label: '单位',
    prop: 'factory'
  },
  {
    label: '用量',
    prop: 'factory'
  },
  {
    label: '预加量',
    prop: 'factory'
  }
])
const tableData3 = ref([
  {
    factory: '123'
  }
])

const tableHeader4 = ref([
  {
    label: '指令',
    prop: 'factory'
  },
  {
    label: '型体',
    prop: 'factory'
  },
  {
    label: '指令类型',
    prop: 'factory'
  },
  {
    label: '订单量',
    prop: 'factory'
  },
  {
    label: '预补数',
    prop: 'factory'
  }
])
const tableData4 = ref([
  {
    factory: '123'
  }
])

const tableHeader5 = ref([
  {
    label: '指令',
    prop: 'factory'
  },
  {
    label: '物料编码',
    prop: 'factory'
  },
  {
    label: '材料颜色',
    prop: 'factory'
  },
  {
    label: '材料名称',
    prop: 'factory'
  },
  {
    label: '规格',
    prop: 'factory'
  },
  {
    label: '单位',
    prop: 'factory'
  },
  {
    label: '用量',
    prop: 'factory'
  },
  {
    label: '预加量',
    prop: 'factory'
  }
])
const tableData5 = ref([
  {
    factory: '123'
  }
])

const tableHeader6 = ref([
  {
    label: '指令',
    prop: 'factory'
  },
  {
    label: '指令类型',
    prop: 'factory'
  },
  {
    label: '用量',
    prop: 'factory'
  },
  {
    label: '预加量',
    prop: 'factory'
  }
])
const tableData6 = ref([
  {
    factory: '123'
  }
])
</script>

<style lang="less" scoped>
.main {
  width: 100%;
  background-color: white;
}

.btns {
  display: flex;
  padding: 10px 35px 5px;
  justify-content: end;

  .bg {
    background-color: #e7e7e7;
    border: 1px solid #e7e7e7;
    color: #000000;
  }
}
</style>
